<template>
  <lay-container fluid>
    <lay-row>
          <lay-col md="24" class="drag-item">
            <div><h3><a href="#" onclick="window.history.go(-1);">返回</a></h3></div>
            <div class="grid-demo">
              <div class="card-container">
                <lay-card>
                  <div class="link-box" v-for="(node, i) in form" :key="i">
                      <span class="link-item">
                          {{node.val}}
                      </span>
                  </div>
                </lay-card>
              </div>
            </div>
          </lay-col>
    </lay-row>
  </lay-container>
</template>

<script>
import {ref, reactive, toRefs, onMounted} from 'vue';
import { layer } from '@layui/layer-vue'

import {getModelsColume, getModelsData, editModels} from '@/api/model'

import { useRouter } from 'vue-router'

export default {
  setup (){
    const router = useRouter();
    const id = router.currentRoute.value.query.id;
    const modelname = router.currentRoute.value.query.modelname;
    const fields = router.currentRoute.value.query.fields.split(",");

    const state = reactive({
      form: [],
    })

    const getTableName = () => {
      getModelsData(modelname,id).then(res => {
        let obj = res.data[0];
        for(let key in obj){
          if(fields.includes(key)){
            var str = obj[key];
            //str = str.replace("　　","<br>")
            console.log(str)
            state.form.push({name:key,val:str});
          }
        }
        console.log(state.form)
      })
    }

    onMounted(getTableName)

    return {
      ...toRefs(state),
    }
  }
}
</script>